<%--
  Created by IntelliJ IDEA.
  User: 1daon
  Date: 2019/1/14
  Time: 9:42 PM
  To change this template use File | Settings | File Templates.
--%>
<%@ page import="java.net.URLEncoder" %>
<%@ page import="org.apache.commons.lang3.StringUtils" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="zh-CN">
<%--记录跳转地址，可能因为没有权限，而跳转到登录页面，要记录上次的访问地址--%>
    <%
    String ret = request.getParameter("ret");
    if(StringUtils.isNotBlank(ret)) {
        ret = URLEncoder.encode(ret);
    } else {
        ret = "";
    }
%>
<html>
<head>
    <title>后台登录</title>
    <meta charset="utf-8"/>
    <meta name="renderer" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
    <link rel="shortcut icon" href="/images/backend/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="/plugin/layui/css/layui.min.css"/>
    <link rel="stylesheet" href="/plugin/vegas/vegas.min.css"/>
    <link rel="stylesheet" href="/css/backend/login.css"/>
    <link rel="stylesheet" href="/css/backend/common.css"/>
    <link rel="stylesheet" href="/plugin/iconfont/iconfont.css"/>
    <style>
        .layadmin-user-login{
            padding:95px 0;
        }
        .layadmin-user-login-main{
            height:inherit;
        }
        #wx-login #wx-code-warp {
            width: 300px;
            height: 340px;
        }
        #wx-login #wx-code-warp #qrcode {
            width: 300px;
            height: 315px;
            padding-top: 10px;
            padding-left: 0;
            padding-right: 0;
            overflow: hidden;
        }
        .layui-icon-login-wechat{
            color:#1E7ED8;
        }
        #qrcode iframe{
            margin-top: -50px;
        }
        #qrcode img{
            margin: 20px 10px;
        }
        .impowerBox .qrcode {width: 200px;}
        .impowerBox .title {display: none;}
        .impowerBox .info {width: 200px;}
        .status_icon {display：none  !important}
        .impowerBox .status {text-align: center;}
    </style>
</head>
<body class="layui-layout-body" style="background-color: #eee">
<div class="layadmin-user-login">
    <div class="layadmin-user-login-main">
        <div class="layadmin-user-login-box layadmin-user-login-header" style="padding:10px;">
            <h2 style="margin: 0;font-size: 20px;">包头市领导干部包联服务重点民营企业专项行动工作管理平台</h2>
        </div>
        <form class="layui-form" action="/sys/login/login.do?ret=<%=ret%>" method="post" id="validate-form">
            <div id="normal-login" class="layadmin-user-login-box layadmin-user-login-body layui-form" style="padding-bottom: 0;padding:10px; ">
                <div class="layui-form-item">
                    <label class="layadmin-user-login-icon layui-icon layui-icon-username" for="username"></label>
                    <input type="text" name="username" id="username" placeholder="手机号/邮箱" class="layui-input" required/>
                </div>
                <div class="layui-form-item">
                    <label class="layadmin-user-login-icon layui-icon layui-icon-password" for="password"></label>
                    <input type="password" id="password" name="password" placeholder="密码" class="layui-input" minlength="5" required/>
                </div>
                <div class="layui-form-item">
                    <div class="layui-row">
                        <div class="layui-col-xs7">
                            <label class="layadmin-user-login-icon layui-icon layui-icon-vercode" for="verify"></label>
                            <input type="text" name="verify" id="verify" placeholder="验证码" class="layui-input" maxlength="4" required/>
                        </div>
                        <div class="layui-col-xs5">
                            <div class="layadmin-user-login-code-warp">
                                <img id="verify-img" src="/sys/login/getVerifyCode.do" onclick="this.src='/sys/login/getVerifyCode.do?'+Math.random()" class="layadmin-user-login-codeimg"/>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item" style="margin-bottom: 20px;height:30px;">
                    <input type="checkbox" name="remember" value="1" id="remember" title="记住密码" lay-skin="primary" style="color: #fff;">
                    <!--<a lay-href="{:U('psadmin/forget')}" class="layadmin-user-jump-change layadmin-link" style="margin-top: 7px;">忘记密码？</a>-->
                </div>
                <div class="layui-form-item">
                    <a class="layui-btn layui-btn-fluid" id="login-btn" style="height: 50px; line-height: 50px; font-size: 18px;">登 录</a>
                </div>
                <div class="layui-trans layui-form-item layadmin-user-login-other" style="display: none;">
                    <label>企业微信账号登录</label>
                    <a href="javascript:;" id="wx-login-btn">
                        <!--<i class="layui-icon layui-icon-login-wechat"></i>-->
                        <i class="layui-icon layui-icon-login-wechat iconfont icon-qiyeweixin"></i>
                    </a>
                    <!--<a lay-href="/user/reg" class="layadmin-user-jump-change layadmin-link">注册帐号</a>-->
                </div>
            </div>
            <div id="wx-login">
                <p>微信登录</p>
                <div class="layui-form-item">
                    <select lay-filter="work-unit" name="work-unit">
                        <option value="">请选择登录单位</option>
                    </select>
                </div>
                <div id="wx-code-warp">
                    <div id="qrcode"></div>
                    <div id="mask">
                        <div class="exclamation">
                            <img src="/images/backend/exclamation.png">
                            请选择要登录的单位
                        </div>
                    </div>
                </div>
                <p><a href="/sys/login">账号登录</a></p>
            </div>
        </form>
    </div>
    <div class="layui-trans layadmin-user-login-footer">
        <p>
            © 2018
            <a href="http://www.pasis.com/" target="_blank">www.pasis.com</a>
        </p>
    </div>
</div>
<script src="/plugin/jquery/jquery.min.js"></script>
<script src="/plugin/jquery-cookie/jquery.cookie.js"></script>
<script src="/plugin/jquery.validation/jquery.validate.min.js"></script>
<script src="/plugin/layui/layui.all.min.js"></script>
<script src="/plugin/vegas/vegas.min.js"></script>
<script src="/plugin/qrcode/qrcode.min.js"></script>
<script src="/plugin/jquery.validation/localization/messages_zh.js"></script>
<script src="/js/backend/common.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#username').keyup(function(){
            var username = $('#username').val();
            if(username != ""){
                var psd = $.cookie(username);
                if(psd != null){
                    $('#password').val(psd);
                    $('#remember').attr("checked", true);
                    layui.form.render();
                }
            }
        });
        layui.form.on('select(work-unit)', function(data){
            if(data.value != '') {
                qrcode.makeCode('http://www.campus.com/psadmin/login?site_id=' + data.value);
                $('#mask').hide();
            } else {
                $('#mask').show();
            }
        });
        $("body").vegas({
            slides: [
                { src: "/images/backend/login_bg_01.jpg"},
                { src: "/images/backend/login_bg_02.jpg"},
                { src: "/images/backend/login_bg_03.jpg"},
                { src: "/images/backend/login_bg_04.jpg"},
                { src: "/images/backend/login_bg_05.jpg"}
            ],
            firstTransition: 'fade',
            firstTransitionDuration: 1000,
            delay: 15000,
            transitionDuration: 3000
        });

        var qrcode = new QRCode(document.getElementById("qrcode"), {
            width : 280,
            height : 280
        });
        qrcode.makeCode('Enterprise');

        // 表单验证
        $("#validate-form").validate();

        // 登录按钮
        $('#login-btn').click(function(event) {
            if($("#validate-form").valid()) {
                show_loading();
                $.ajax({
                    url: $("#validate-form").attr('action'),
                    type: 'POST',
                    dataType: 'json',
                    data: $("#validate-form").serialize(),
                })
                    .done(function(data, textStatus, jqXHR) {
                        if(data.status == 0) {
                            window.location.href = '/sys/index.page';
                        }else{
                            layer.msg(data.msg, {icon: 5, shift: 6});
                            $('#verify-img').click();
                        }
                    })
                    .fail(function(jqXHR, textStatus, errorThrown) {
                        layer.msg(textStatus, {icon: 5, shift: 6});
                        $('#verify-img').click();
                    })
                    .always(function() {
                        close_loading();
                    });
            }
        });

        $('#wx-login-btn').click(function(event) {
            $('#normal-login').hide();
            $('#wx-login').animate({
                height: '460',
                display: 'block'
            });
        });
        $('#work-unit').change(function(event) {
            debugger
            qrcode.makeCode('http://www.123.com?id=1');
        });
    });
</script>
</body>
</html>
